<template>
    <div class="log">
        <p class="p1">
            <input type="text" placeholder="请输入手机号" v-model="tel">
        </p>
         <p class="p2">
              <input type="text" placeholder="请输入验证码" v-model="code">
              <button @click="btn">获取验证码</button>
         </p>
         <p class="p3">
            <button>登陆</button>
         </p>
    </div>
</template>
<script>
export default {
    name:"Login",
    props:{

    },
    components:{

    },
    data(){
        return {
           tel:"",
           code:""
        }
    },
    computed:{

    },
    methods:{
          btn(){
              let telReg=/^1[3-9]\d{9}$/;
              if(!telReg.test(this.tel)){
                 alert("请您输入正确的手机号")
              }
          }
    },
    created(){
         
    },
    mounted(){
       
    }
}
</script>
<style scoped lang="scss">
@import "~@/scss/common.scss";
.log{
    width:100%;
    height:100%;
    .p1{
        width:100%;
        height:pxTorem(40px);
        text-align: center;
        margin-top:pxTorem(10px);
        input{
           width:100%;
           outline:0;
           border:0;
           padding-left:7px;
           height:pxTorem(30px);
           line-height:pxTorem(30px);
           border-radius:10px;
        }
    }
    .p2{
        width:100%;
        height:pxTorem(40px);
        margin-top:pxTorem(4px);
        text-align: center;
        input{
           width:74%;
           outline:0;
           border:0;
           padding-left:7px;
           height:pxTorem(30px);
           line-height:pxTorem(30px);
           border-radius:10px;
        }
        button{
             padding:pxTorem(7px);
             outline:0;
             background:skyblue;
             border:0;
             text-align: center;
             color:white;
             border-radius:4px;
             font-size:pxTorem(14px);
        }
    }
    .p3{
        width:100%;
        height:pxTorem(40px);
        margin-top:pxTorem(4px);
        text-align:center;
        margin-top:pxTorem(10px);
         button{
             padding:pxTorem(7px);
             outline:0;
             background:skyblue;
             border:0;
             color:white;
             border-radius:4px;
             font-size:pxTorem(14px);
        }
    }
}

</style>